<template>
  <div style="padding-top: 46px;">
    <van-nav-bar fixed :title="keyword + ' 的搜索结果'"></van-nav-bar>
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <van-cell @click="$router.push(`/article?id=${item.art_id.toString()}`)" v-for="item in list" :key="item.art_id.toString()" :title="item.title" />
    </van-list>
  </div>
</template>

<script>
import { searchArticle } from '@/api/article'
export default {
  data () {
    return {
      keyword: '',
      list: [],
      loading: false,
      finished: false,
      page: 1
    }
  },
  created () {
    this.keyword = this.$route.query.keyword
  },
  methods: {
    async onLoad () {
      const res = await searchArticle(this.page, this.keyword)
      this.list = [...this.list, ...res.data.results]
      this.page++
      console.log(this.list)
      this.loading = false
      if (res.data.results.length < 10) {
        this.finished = true
      }
    }
  }
}
</script>

<style>

</style>
